import React ,{Component} from 'react';
import { Upload, message, Button, Icon ,Input} from 'antd';
import './index.less';
const props = {
  name: 'file',
  action: 'https://www.mocky.io/v2/5cc8019d300000980a055e76',
  headers: {
    authorization: 'authorization-text',
  },
  onChange({file,fileList,defaultFileList}) {
    debugger
      console.log('file',file);
      console.log('fileList',fileList);
      console.log('defaultFileList',defaultFileList);
    if (file.status !== 'uploading') {
      console.log(file, fileList);
    }
    if (file.status === 'done') {
      message.success(`${file.name} file uploaded successfully`);
    } else if (file.status === 'error') {
      message.error(`${file.name} file upload failed.`);
    }
  },
};
class Uploads extends Component {
  constructor(props){
    super(props)
    this.state={
      values:''
    }
  }
  onChange=(e)=>{
    console.log('e',e.target)
    this.setState({
      values:e.target.value
    })
  }
  render(){

      return(
        <div>
          <Upload {...props}>
              <Button>
              <Icon type="upload" /> Click to Upload
              </Button>
          </Upload>
          <p/>
          <p/><p/><p/>

          <Input onChange={this.onChange} />
          <div style={{width:'700px',border:'1px solid #000'}}>
            
            <label for='aa'>
              {this.state.values}
            </label>
            <input type='text' name='aa' id='aa'></input>
          </div>
        </div>
      )
  }
}
export default Uploads;